import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '../views/Home.vue'

Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    redirect: '/home'

  },
  {
    path: '/home',
    name: 'home',
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: Home,
    meta: { isFootBar: true, title: '首页' }
  },
  {
    path: '/modul1',
    name: 'modul1',
    meta: { isFootBar: true, title: '模块1' },
    component: () =>
      import(/* webpackChunkName: "about" */ '../views/modul1')
  },
  {
    path: '/modul3',
    name: 'modul3',
    meta: { isFootBar: true, title: '模块3' },
    component: () =>
      import(/* webpackChunkName: "about" */ '../views/modul3')
  },
  {
    path: '/modul2',
    name: 'modul2',
    meta: { isFootBar: true, title: '模块2' },
    component: () =>
      import(/* webpackChunkName: "about" */ '../views/modul2')
  },
  {
    path: '/404',
    name: '404',

    component: () => import('@/views/404')
  },
  {
    path: '*',
    redirect: '/404',
    meta: {
      title: '404错误页面'
    }
  }
]

const router = new VueRouter({
  routes
})
router.onError(error => {
  const pattern = /Loading chunk (\d)+ failed/g
  const isChunkLoadFailed = error.message.match(pattern)

  const targetPath = router.history.pending.fullPath
  if (isChunkLoadFailed) {
    router.replace(targetPath)
  }
})
export default router
